<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page isELIgnored="false"%>
<jsp:include page="../frame/header.jsp"></jsp:include>

<title>添加球赛信息</title>
<style>
#hostIcon{
	position:absolute;
	left:600px;
	top:250px;
}
#custIcon{
	position:absolute;
	left:600px;
	top:340px;
}
</style>
</head>

<body>
	<div class="container-fluid">
		<div class="row-fluid">
			<div>
				<ul class="breadcrumb">
					<li><a href="#">生活信息</a> <span class="divider">/</span></li>
					<li><a href="#">球赛赛程指南</a></li>
				</ul>
			</div>

			<div class="box">
				<div class="box-header well" data-original-title>
					<h2>
						<i class="icon-edit"></i> 添加赛程
					</h2>
					<div class="box-icon">
						<a href="#" class="btn btn-setting btn-round"><i
							class="icon-cog"></i></a> <a href="#"
							class="btn btn-minimize btn-round"><i class="icon-chevron-up"></i></a>
						<a href="#" class="btn btn-close btn-round"><i
							class="icon-remove"></i></a>
					</div>
				</div>
				<div class="box-content">
					<form id="myform" class="form-horizontal" method="post" action="<c:url value="/admin/live/ball" />">
						<fieldset>
							<input type="hidden" name="infoId" value="${ball.infoId }">
							<div class="control-group">
								<label class="control-label" for="sortId">分类</label>
								<div class="controls">
									<select id="sortId" name="sortId" class="input-xlarge" name="liveSorts" >
									<c:forEach var="sort" items="${sorts }">
										<option value="${sort.sortId }" <c:if test='${sort.sortId == ball.sortId }'>selected</c:if> >${sort.sortName }</option>
									</c:forEach>
									</select>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="ballType">球赛类型</label>
								<div class="controls">
									<select id="ballType" class="input-xlarge" name="ballType" >
										<option value="1" <c:if test='${1 == ball.ballType }'>selected</c:if>>世界杯</option>
										<option value="2" <c:if test='${2 == ball.ballType }'>selected</c:if>>欧冠</option>
										<option value="3" <c:if test='${3 == ball.ballType }'>selected</c:if>>意甲</option>
										<option value="4" <c:if test='${4 == ball.ballType }'>selected</c:if>>英超</option>
									</select>
								</div>
							</div>
							
							<div class="control-group">
								<label class="control-label" for="name">球赛名称</label>
								<div class="controls">
									<input class="input-xlarge" id="name" name="name" type="text" check-type="required" required-message="请输入球赛名称"
										value="${ball.name }" >
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="hostName">主场队</label>
								<div class="controls">
									<input class="input-xlarge" id="hostName" name="hostName" type="text" check-type="required" required-message="请输入主场队"
										value="${ball.hostName }" >
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="fileInput">主场队logo</label>
								<div class="controls">
									<input class="input-file uniform_on" name="file"
										id="userHeader1" type="file"> <input type="button"
										value="upload" onclick="return ajaxFileUpload1();">
								</div>
								<img id="loading1" class="hide" src="<c:url value="/resources/img/ajax-loader-6.gif"/>">
								<img id="hostIcon" src='<c:url value="/resources/fileupload/${ball.hostIcon }"/>' height="80">
								<input type="hidden" name="hostIcon" value="${ball.hostIcon }">
							</div>
							<div class="control-group">
								<label class="control-label" for="custName">客场队</label>
								<div class="controls">
									<input class="input-xlarge" id="custName" name="custName" type="text" check-type="required" required-message="请输入客场队"
										value="${ball.custName }" >
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="fileInput">客场队logo</label>
								<div class="controls">
									<input class="input-file uniform_on" name="file"
										id="userHeader2" type="file"> <input type="button"
										value="upload" onclick="return ajaxFileUpload2();">
								</div>
								<img id="loading2" class="hide" src="<c:url value="/resources/img/ajax-loader-6.gif"/>">
								<img id="custIcon" src='<c:url value="/resources/fileupload/${ball.custIcon }"/>' height="80">
								<input type="hidden" name="custIcon" value="${ball.custIcon }">
							</div>
							<div class="control-group">
								<label class="control-label" for="place">比赛地点</label>
								<div class="controls">
									<input class="input-xlarge" id="place" name="place" type="text"
										value="${ball.place }" >
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="date">日期 </label>
								<div class="controls">
									<input class="input-xlarge datepicker" name="date" id="date" check-type="required" required-message="请输入日期"
										type="text" value="${ball.date }" >
								</div>
							</div>

							<div class="control-group">
								<label class="control-label" for="time">时间</label>
								<div class="controls">
									<input class="input-xlarge" id="time" name="time" type="text" check-type="required" required-message="请输入时间"
										value="${ball.time }">
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="description_mc">其他说明 </label>
								<div class="controls">
									<textarea rows="6" name="description_mc" class="input-xxlarge">${ball.description_mc }</textarea>
								</div>
							</div>
							<div class="form-actions">
								<button id="saveBtn" type="button" class="btn btn-primary">保存</button>
								<button id="cancelBtn" type="button" class="btn">返回</button>
							</div>
						</fieldset>
					</form>

				</div>
			</div>
			<!--/span-->

		</div>
	</div>
	<!--/row-->
</body>

<jsp:include page="../frame/scripts.jsp"></jsp:include>
<script type="text/javascript">
$(document).ready(function(){
	$('#cancelBtn').click(function(){
		window.location.href = '<c:url value="/admin/live/live_ball" />';	
	})
	
	$("#myform").validation();
	
	//保存
	$('#saveBtn').click(function(){
		if($("#sortId").val() == null){
			alert("请首先创建属于球赛信息的分类！");
			return;
		}
		$("#myform").submit();
	})
	
	$('.datepicker').datepicker();
})

//上传图片
function ajaxFileUpload1(){
	
	$("#loading1").ajaxStart(function(){
		//开始上传文件时显示一个图片
		$(this).show();
	}).ajaxComplete(function(){
		//文件上传完成将图片隐藏起来
		$(this).hide();
	});
	
	$.ajaxFileUpload({
		url:'<c:url value="/fileupload"/>',//用于文件上传的服务器端请求地址
		secureuri:false,//一般设置为false
		fileElementId:'userHeader1',//文件上传空间的id属性  <input type="file" id="file" name="file" />
		dataType: 'JSON',//返回值类型 一般设置为json(大写)
		success: function (data, status){
			var image = DOMAIN + '/resources/fileupload/'+$(data).html();
			$("#hostIcon").attr('src',image).show();
			$("input[name='hostIcon']").val($(data).html());
		},
		error: function (data, status, e){
			alert(e);
		}	
	})
	
	return false;
}

//上传图片
function ajaxFileUpload2(){
	
	$("#loading2").ajaxStart(function(){
		//开始上传文件时显示一个图片
		$(this).show();
	}).ajaxComplete(function(){
		//文件上传完成将图片隐藏起来
		$(this).hide();
	});
	
	$.ajaxFileUpload({
		url:'<c:url value="/fileupload"/>',//用于文件上传的服务器端请求地址
		secureuri:false,//一般设置为false
		fileElementId:'userHeader2',//文件上传空间的id属性  <input type="file" id="file" name="file" />
		dataType: 'JSON',//返回值类型 一般设置为json(大写)
		success: function (data, status){
			var image = DOMAIN + '/resources/fileupload/'+$(data).html();
			$("#custIcon").attr('src',image).show();
			$("input[name='custIcon']").val($(data).html());
		},
		error: function (data, status, e){
			alert(e);
		}	
	})
	
	return false;
}
</script>